#Compose 中的EditText
Compose的"EditText" 就是 TextField 函式，那就來看看有什麼可以運用的吧

1. TextField
   • 預設的輸入樣式

TextField(
            value = text,
            onValueChange = { text = it },
            label = { Text("Label") }
        )

2. OutlinedTextField
   • 外框樣式版本

OutlinedTextField(
            value = text,
            onValueChange = { text = it },
            label = { Text("Label2",color= Color.Red) }
        )

3. 設定文字欄位樣式
   • singleLine
   • maxLines
   • textStyle

TextField(
            value = value,
            onValueChange = { value = it },
            label = { Text("Enter text") },
            maxLines = 2,
            textStyle = TextStyle(color = Color.Blue, fontWeight = FontWeight.Bold),
            modifier = Modifier.padding(20.dp),
        )

4. 設定鍵盤選項
   • capitalization
   • autoCorrect
   • keyboardType
   • imeAction

可以用這4個參數，來調整限制輸入的資料和對應顯示的鍵盤

TextField(
            value = password,
            onValueChange = { password = it },
            label = { Text("Enter NumberPassword") },
            visualTransformation = VisualTransformation.None,
            keyboardOptions = KeyboardOptions(
                capitalization = KeyboardCapitalization.Characters,
                keyboardType = KeyboardType.NumberPassword,
                autoCorrect = true,
                imeAction = ImeAction.Search
            )
        )  

5. 可以限制或清除輸入的資料
   • 設定電話號碼一定是輸入0 ，其他都會清除

TextField(
            value = input,
            label = { Text("Enter PhoneNumber") },
            onValueChange = { newText ->
                input = newText.trimStart { it != '0' }
            }
        )

顯示的結果:
preview的外框會畫在label2的上面，但模擬器和手機顯示正常，看來是 AS preview版的一個小bug吧

參考:

https://developer.android.com/jetpack/compose/text
https://developer.android.com/reference/kotlin/androidx/compose/ui/text/font/FontWeight